* {
    padding: 0px;
    margin: 0px;
}

a {
    text-align: center;
}

ul,
ol li {
    list-style: none;
}

html,
body {
    height: 100%;
    position: relative;
}

@w: 3.2vw;
.out{
    outline: 1px solid red;
}
.swiper-container {
    height: 100%;
}

.first {
    .start {
        background: #000000;
        height: 100%;
        .one {
             color: #fff;
            font-size: 100/@w;
            line-height: 100/@w;
            position: absolute;
            top: 50%;
            left: 50%;
           margin-left: -60/2/@w;
           margin-top: -100/2/@w;
            text-align: center;
            display: inline-block;
            height: 100/@w;
        }
        .two {
                        color: #fff;
            font-size: 100/@w;
            line-height: 100/@w;
            position: absolute;
            top: 50%;
            left: 50%;
           margin-left: -60/2/@w;
           margin-top: -100/2/@w;
            text-align: center;
            display: inline-block;
            height: 100/@w;
            
        }
        .three {
            color: #fff;
            font-size: 100/@w;
            line-height: 100/@w;
            position: absolute;
            top: 50%;
            left: 50%;
           margin-left: -60/2/@w;
           margin-top: -100/2/@w;
            text-align: center;
            display: inline-block;
            height: 100/@w;
            
        }
    }
     .start_2{
         text-align: center;
         width: 90/@w;
         font-size: 100px;
         color: #fff;
         position: absolute;
         left: 15%;
         top: 10%;
         float: left;
     }
      .start_3{
         text-align: center;
         width: 90/@w;
         font-size: 100px;
         color: #fff;
         position: absolute;
         right:15%;
         top: 10%;
         float: left;
         line-height: 120px;
         
     }
     .start_4{
         text-align: center;
         width: 100%;
         font-size: 100px;
         color: #fff;
         position: absolute;
         top: 50%;
         left: 0;
         margin-top: -100/2/@w;
         float: left;
         line-height: 120px;
         
     }
      .start_5{
         text-align: center;
         width: 90/@w;
         font-size: 130px;
         color: #fff;
         position: absolute;
         left: 50%;
         top: 40/@w;
         margin-left: -100/2/@w;
         float: left;
         line-height: 160px;
         a{
             color:orangered;
             text-decoration: none;
         }
     }
       .start_6{
                  text-align: center;
         width: 100%;
         font-size: 100px;
         color: #fff;
         position: absolute;
         top: 50%;
         left: 0;
         margin-top: -100/2/@w;
         float: left;
         line-height: 120px;
        }
        .start_7{
         text-align: center;
         width: 90/@w;
         font-size: 100px;
         color: #fff;
         position: absolute;
         left: 50%;
         top: 40/@w;
         margin-left: -100/2/@w;
         float: left;
         line-height: 130px;
        }
         .start_8{
         text-align: center;
         width: 90/@w;
         font-size: 120px;
         color: #fff;
         position: absolute;
         left: 8%;
         top: 10/@w;
         
        }
         .start_9{
         text-align: center;
         width: 90/@w;
         font-size: 120px;
         color: #fff;
         position: absolute;
         left: 25%;
         top: 25%;
        }
         .start_10{
         text-align: center;
         width: 90/@w;
         font-size: 120px;
         color: #fff;
         position: absolute;
         left: 40%;
         top: 50%;
        }
         .start_11{
         text-align: center;
         width: 90/@w;
         font-size: 120px;
         color: #fff;
         position: absolute;
         left: 60%;
         top: 75%;
        }
}
.end{
    background:#080808;
    height: 100%;
    position: relative;
    .downbg{
        position: absolute;
        width: 100%;
        bottom: 0px;
    }
    .left1{
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
    }
    .left2{
        width: 10%;
        position: absolute;
        top: 20/@w;
        left: 8/@w;
    }
    .logo{
        width: 80/@w;
        height: 40/@w;
        position: absolute;
        top: 25px;
        left: 40px;
    }
     .dh{
         width:60%;
         height: 50%;
         background: url(../img/bg.gif);
         position: absolute;
         left: 24%;
         top: 15%;
     }
     .w{
         width: 35%;
         position: absolute;
         left: 22%;
         top: 5%;
     } 
     .m{
         width: 35%;
         position: absolute;
         left: 49%;
         top: 19%;
     }
      .b{
         width: 40%;
         position: absolute;
         left: 22%;
         top: 31%;
     }
     .y{
         width: 35%;
         position: absolute;
         left: 49%;
         top: 38%;

     }
      .yang{
         width: 43%;
         position: absolute;
         left: 33%;
         top: 50%;

     }
     .right{
         width: 10%;
        position: absolute;
        top: 150/@w;
        right: 2/@w;
         
     }
     .mohu{
         
        position: absolute;
        top: 12/@w;
        left: 2/@w;
         
     }
     .jr{
         position: absolute;
         bottom: 20%;
         width: 60%;
         left: 20%;
     }
}
